{extend name="layout:base" /}
{block name="page_style"}
  <link rel="stylesheet" href="{$site_root}/static/plugins/simditor2.3.15/styles/simditor.css" />
{/block}
{block name="page_content"}
<div class="tabbable">
  <ul class="nav nav-tabs" id="myTab">
    <li class="active">
      <a data-toggle="tab" href="#basic">
        基本信息
      </a>
    </li>
    <li>
      <a data-toggle="tab" href="#seo">
        SEO设置
      </a>
    </li>
  </ul>
  <form class="form-horizontal adminform" id="model-form" method="post" action="">
    <div class="tab-content">
      <div id="basic" class="tab-pane fade in active">
        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
            分类：<span class="red">*</span>
          </label>
          <div class="col-sm-10">
            <select name="second_category_id" id="second_category_id" class="col-sm-5" onchange="checkExtFields();">
              <option value="0" data-attached="0" data-sub="0">请选择分类</option>
              {volist name="categories" id="cat"}
              <?php if(isset($article['second_category_id']) && $article['second_category_id'] == $cat['id']): ?>
                <option value="{$cat.id}" data-attached="{$cat.is_attached}" data-sub="{$cat.is_subscribe}" selected="selected">{$cat.title}</option>
              <?php else: ?>
                <option value="{$cat.id}" data-attached="{$cat.is_attached}" data-sub="{$cat.is_subscribe}">{$cat.title}</option>
              <?php endif; ?>
            {/volist}
            </select>
          </div>
        </div>
        <div class="space-4"></div>

        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
            标题：<span class="red">*</span>
          </label>
          <div class="col-sm-10">
            <input type="text" name="title" placeholder="请输入标题" class="col-xs-10 col-sm-5" value="{$article.title|default=''}" required/>
          </div>
        </div>
        <div class="space-4"></div>

        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
            封面图片：<span class="red">*</span>
            <br/>350x250(宽x高)
          </label>
          <div class="col-sm-10">
            {:add_upload_image("pc_cover_id", 175, 125, $article['pc_cover_id'])}
          </div>
        </div>
        <div class="space-4"></div>

        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
            摘要：<span class="red">*</span>
          </label>
          <div class="col-sm-8">
            <textarea name="description" class="form-control" maxlength="50">{$article.description|default=''}</textarea>
          </div>
        </div>
        <div class="space-4"></div>

        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
            正文：<span class="red">*</span>
          </label>
          <div class="col-sm-8">
            <textarea name="content" class="form-control" id="content" rows="3" placeholder="请填入至少3个字符的内容。">{$article.content|default=''}</textarea>
          </div>
        </div>
        <div class="space-4"></div>

        <div class="form-group ext-subscribe">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
            主办单位：<span class="red">*</span>
          </label>
          <div class="col-sm-10">
            <input type="text" name="host" placeholder="请输入主办单位名称" class="col-xs-10 col-sm-5" value="{$article.host|default=''}"/>
          </div>
        </div>
        <div class="space-4"></div>

        <div class="form-group ext-subscribe">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
            活动地址：<span class="red">*</span>
          </label>
          <div class="col-sm-10">
            <input type="text" name="address" placeholder="请输入活动地址" class="col-xs-10 col-sm-5" value="{$article.address|default=''}"/>
          </div>
        </div>
        <div class="space-4"></div>

        <div class="form-group ext-subscribe">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
            报名时间：<span class="red">*</span>
          </label>
          <div class="col-sm-10">
            <input type="text" name="start_time" id="start_time" placeholder="报名开始日期" class="col-sm-3 datepicker" value="{$article.start_time|default=''|format_show_time=###,'only_date'}">
            <div class="col-xs-10 col-sm-1 text-center">——</div>
            <input type="text" name="end_time" id="end_time" placeholder="报名结束日期" class="col-sm-3 datepicker" value="{$article.end_time|default=''|format_show_time=###,'only_date'}">
          </div>
        </div>
        <div class="space-4"></div>

        <div class="form-group ext-subscribe">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
            报名费用：<span class="red">*</span>
          </label>
          <div class="col-sm-10">
            <input type="text" name="unit_price" placeholder="例：1999/人" class="col-xs-10 col-sm-5" value="{$article.unit_price|default=''}"/>
          </div>
        </div>
        <div class="space-4"></div>

        <div class="form-group ext-attached ext-subscribe">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
            附件：
          </label>
          <div class="col-sm-10">
            {:create_upload_image("attachment_path", 100, 100, '', '', 'file')}
            <a id="attachment_path_preview" href="#" target="_blank">预览</a>
          </div>
        </div>
        <div class="space-4"></div>

        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1"> 是否推荐：  </label>
          <div class="col-sm-10" style="padding-top:5px;">
            <input name="is_recommand" value="1" class="ace ace-switch ace-switch-4 btn-flat" type="checkbox" <?php if(isset($article["is_recommand"]) && intval($article["is_recommand"])){echo('checked="checked"');} ?> />
            <span class="lbl"></span>
          </div>
        </div>
        <div class="space-4"></div>

        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1"> 显示状态：  </label>
          <div class="col-sm-10" style="padding-top:5px;">
            <input name="status" value="1" class="ace ace-switch ace-switch-4 btn-flat" type="checkbox" <?php if(isset($article["status"]) && intval($article["status"])){echo('checked="checked"');} ?> />
            <span class="lbl"></span>
          </div>
        </div>
        <div class="space-4"></div>

        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1"> 排序编号：  </label>
          <div class="col-sm-10">
            <input type="text" name="sort" maxlength="4" placeholder="编号越小越靠前" value="{$article.sort|default='0'}" class="col-xs-10 col-sm-5"/>
          </div>
        </div>
        <div class="space-4"></div>
      </div>
      <div id="seo" class="tab-pane fade">
        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
            SEO关键词：
          </label>
          <div class="col-sm-8">
            <textarea name="seo_keywords" class="form-control">{$article.seo_keywords|default=''}</textarea>
          </div>
        </div>
        <div class="space-4"></div>

        <div class="form-group">
          <label class="col-sm-2 control-label no-padding-right" for="form-field-1">
            SEO摘要：
          </label>
          <div class="col-sm-8">
            <textarea name="seo_description" class="form-control">{$article.seo_description|default=''}</textarea>
          </div>
        </div>
        <div class="space-4"></div>
      </div>
    </div>
    <div class="clearfix form-actions">
      <div class="col-md-offset-3 col-md-9">
        <?php if(isset($article['id'])): ?>
          <input type="hidden" name="id" value="{$article.id}">
        <?php endif; ?>
        <button class="btn btn-info" type="submit">
          <i class="ace-icon fa fa-check bigger-110"></i>
          保存
        </button>

        &nbsp; &nbsp; &nbsp;
        <a class="btn" href="{:url('index')}">
          <i class="ace-icon fa fa-undo bigger-110"></i>
          返回
        </a>
      </div>
    </div>
  </form>
{/block}
{block name="page_js"}
  <script src="{$site_root}/static/plugins/simditor2.3.15/scripts/module.js"></script>
  <script src="{$site_root}/static/plugins/simditor2.3.15/scripts/hotkeys.js"></script>
  <script src="{$site_root}/static/plugins/simditor2.3.15/scripts/uploader.js"></script>
  <script src="{$site_root}/static/plugins/simditor2.3.15/scripts/simditor.js"></script>
  <script src="{$site_root}/static/plugins/jquery-validate/jquery.validate.min.js"></script>
  <script src="{$site_root}/static/ace1.4/assets/js/bootstrap-datepicker.min.js"></script>
  <script type="text/javascript">
    function checkExtFields(){
      var $form = $("form#model-form");
      var $optSelected = $("#second_category_id").find("option:selected");
      if(parseInt($optSelected.data('sub')) == 1){
        $form.find('.form-group.ext-subscribe').removeClass('hide');
        $form.find('.form-group.ext-attached iframe').attr('width', 100).attr('height', 100);
        $form.find('.form-group.ext-subscribe input[type=text]').removeClass('ext-hide');
      }else{
        $form.find('.form-group.ext-subscribe').addClass('hide');
        $form.find('.form-group.ext-subscribe input[type=text]').addClass('ext-hide');
        if(parseInt($optSelected.data('attached')) == 1){
          $form.find('.form-group.ext-attached').removeClass('hide');
          $form.find('.form-group.ext-attached iframe').attr('width', 100).attr('height', 100);
          $form.find('.form-group.ext-attached input[type=text]').removeClass('ext-hide');
        }
      }
    }

    $(document).ready(function(){
      checkExtFields();

      $('.datepicker').datepicker({
        minView: "month", //选择日期后，不会再跳转去选择时分秒
        format: "yyyy-mm-dd", //选择日期后，文本框显示的日期格式
        language: 'zh-CN', //汉化
        autoclose:true //选择日期后自动关闭
      });

      var editor = new Simditor({
        textarea: $('#content'),
        upload: {
          url: '{:url("upload/simditor")}',
          type: 'post',
          fileKey: 'upfile',
          connectionCount: 3,
          leaveConfirm: '文件上传中，关闭此页面将取消上传。'
        },
        pasteImage: true,
      });

      $("form#model-form").validate({
        'ignore': '.ext-hide',
        rules:{
          "second_category_id":{
            required: true,
            min: 1
          }, "title":{
            required: true,
            maxlength: 3,
            maxlength: 50
          }, "pc_cover_id":{
            required: true,
            min: 1
          }, "content":{
            required: true,
            minlength: 10
          }, "description":{
            required: true,
            minlength: 10,
            maxlength: 50
          }, "host":{
            required: true,
            maxlength: 20
          }, "address":{
            required: true,
            maxlength: 50
          }, "unit_price":{
            required: true,
            maxlength: 10
          }, "start_time":{
            required: true
          }, "end_time":{
            required: true
          }, "sort":{
            min: 0,
            max: 9999
          }
        },
        messages:{
          "second_category_id":{
            required: '分类不能为空',
            min: '分类不能为空'
          }, "title":{
            required: '标题不能为空',
            maxlength: '长度必须在3-50个字符之间',
            maxlength: '长度必须在3-50个字符之间'
          }, "pc_cover_id":{
            required: '封面图片不能为空',
            min: '封面图片不能为空'
          }, "content":{
            required: '正文信息不能为空',
            minlength: '正文信息长度不能少于10个字符'
          }, "description":{
            required: '摘要信息不能为空',
            minlength: '摘要长度不能少于10个字符',
            maxlength: '摘要长度不能超过200个字符'
          }, "host":{
            required: '主办单位不能为空',
            maxlength: '主办单位长度不能超过20个字符'
          }, "address":{
            required: '活动地址不能为空',
            maxlength: '活动地址不能超过50个字符'
          }, "unit_price":{
            required: '报名费用不能为空',
            maxlength: '报名费用长度不能超过20个字符'
          }, "start_time":{
            required: '报名开始时间不能为空'
          }, "end_time":{
            required: '报名结束时间不能为空'
          }, "sort":{
            min: "排序编号不能小于0",
            max: "排序编号不能大于9999"
          }
        },
        errorClass: "help-inline input-error",
        errorElement: "span",
        highlight:function(element, errorClass, validClass) {
          $(element).parents('.form-group').addClass('has-error');
        },
        unhighlight: function(element, errorClass, validClass) {
          $(element).parents('.form-group').removeClass('has-error');
          // $(element).parents('.form-group').addClass('success');
        },
        submitHandler: function(form){
          var $form = $(form);
          $.ajax({
            url: $form.attr("action"),
            type: $form.attr("method"),
            dataType: "JSON",
            data: $form.serialize(),
            success: function(data){
              if(data.code){
                location.href = data["url"];
              }else{
                alert(data["msg"]);
              }
            }, error: function () {
              alert("数据执行错误！");
            }
          });
        }
      });
    });
  </script>
{/block}